/*
前端应用入口文件

本文件是mbnstock前端项目的主入口，负责初始化Vue应用，配置全局组件、指令和工具方法。
相关知识点：Vue 3 + Element Plus (参考文档：技术知识点.md - 2. Vue 3 + Element Plus)
*/
import { createApp } from 'vue' // 导入Vue 3的createApp函数

import Cookies from 'js-cookie' // 导入Cookie处理库

// 导入Element Plus组件库及其样式
import ElementPlus from 'element-plus' // Element Plus组件库
import 'element-plus/dist/index.css' // Element Plus默认样式
import locale from 'element-plus/es/locale/lang/zh-cn' // 中文语言包
import 'element-plus/theme-chalk/dark/css-vars.css' // 暗黑主题样式

import '@/assets/styles/index.scss'; // 导入全局样式

// 导入根组件和核心模块
import App from './App' // 根组件
import directive from './directive'; // 自定义指令
import router from './router' // Vue Router路由配置
import store from './store' // Vuex状态管理

// 注册指令
import { download } from '@/utils/request' // 文件下载工具
import plugins from './plugins'; // 插件配置

// SVG图标支持
import SvgIcon from '@/components/SvgIcon' // SVG图标组件
import elementIcons from '@/components/SvgIcon/svgicon' // Element图标集
import 'virtual:svg-icons-register' // 注册SVG图标

import './permission'; // 权限控制配置

// 导入常用工具函数
import { useDict } from '@/utils/dict' // 字典工具
import { addDateRange, handleTree, parseTime, resetForm, selectDictLabel, selectDictLabels } from '@/utils/ruoyi'

// 导入全局组件
import Pagination from '@/components/Pagination' // 分页组件
import RightToolbar from '@/components/RightToolbar' // 自定义表格工具组件
import Editor from "@/components/Editor" // 富文本编辑器组件
import FileUpload from "@/components/FileUpload" // 文件上传组件
import ImageUpload from "@/components/ImageUpload" // 图片上传组件
import ImagePreview from "@/components/ImagePreview" // 图片预览组件
import DictTag from '@/components/DictTag' // 字典标签组件

// 创建Vue应用实例
const app = createApp(App)

// 全局方法挂载
// 将工具方法挂载到全局，方便在组件中直接使用
app.config.globalProperties.useDict = useDict // 字典工具
app.config.globalProperties.download = download // 文件下载
app.config.globalProperties.parseTime = parseTime // 时间格式化
app.config.globalProperties.resetForm = resetForm // 表单重置
app.config.globalProperties.handleTree = handleTree // 树结构处理
app.config.globalProperties.addDateRange = addDateRange // 日期范围处理
app.config.globalProperties.selectDictLabel = selectDictLabel // 字典标签选择
app.config.globalProperties.selectDictLabels = selectDictLabels // 多字典标签选择

// 全局组件挂载
// 注册常用组件，使其在所有页面中可用
app.component('DictTag', DictTag) // 字典标签组件
app.component('Pagination', Pagination) // 分页组件
app.component('FileUpload', FileUpload) // 文件上传组件
app.component('ImageUpload', ImageUpload) // 图片上传组件
app.component('ImagePreview', ImagePreview) // 图片预览组件
app.component('RightToolbar', RightToolbar) // 表格工具条组件
app.component('Editor', Editor) // 富文本编辑器组件

// 使用核心插件
app.use(router) // 使用Vue Router
app.use(store) // 使用Vuex
app.use(plugins) // 使用自定义插件
app.use(elementIcons) // 使用Element图标
app.component('svg-icon', SvgIcon) // 注册SVG图标组件

// 注册自定义指令
directive(app)

// 配置Element Plus
// 相关知识点：Vue 3 + Element Plus (参考文档：技术知识点.md - 2. Vue 3 + Element Plus)
app.use(ElementPlus, {
  locale: locale, // 使用中文语言包
  // 设置全局组件大小，支持 large、default、small
  size: Cookies.get('size') || 'default'
})

// 挂载应用到DOM
app.mount('#app') // 将应用挂载到id为'app'的DOM元素上
